import { defineComponent } from 'vue'
import '../../styles/player-video.less'

export default defineComponent({
  props: {
    // 组件类型
    componentType: {
      type: Number,
      default: 1
    }
  },
  setup(props) {
    const playerLine = ['腾讯', '优酷', '爱奇艺', '芒果']
    const playerLanguage = ['普通话', '粤语版', '英文版', '韩语版']
    return () => (
      <div class="pl-4 w-full">
        <h4 class="mt-3 mb-2 text-sm font-medium text-black">{props.componentType === 1 ? '播放线路' : '语言'}</h4>
        <div class="flex w-full overflow-hidden">
          {(props.componentType === 1 ? playerLine : playerLanguage).map((item, index) => {
            return (
              <span key={item} class={index === 1 ? 'play-line-active play-line-item' : 'play-line-item'}>
                {item}
              </span>
            )
          })}
        </div>
      </div>
    )
  }
})
